export default {
	name: 'duiqi',
	methods: {
		/**
		 * 待做：框选对齐，现在是画布内的所有组件都参与了对齐。
		 * 只选一个组件时，对齐操作是相对于画布的。
		 * 多选组件时，则按照现有对齐逻辑来做。
		 * @param {Object} border 对齐方式
		 */
		duiqiBorder(border) {
			if(this.list.length === 1) {
				const item = this.list[0]
				const canvasRect = this.getBoundingClientRect()
				if(border === 'left') {
					item.ddr.transform = {
						...item.ddr.transform,
						x: 0,
					}
				} else if(border === 'right') {
					item.ddr.transform = {
						...item.ddr.transform,
						x: canvasRect.width - item.ddr.transform.width,
					}
				} else if(border === 'top') {
					item.ddr.transform = {
						...item.ddr.transform,
						y: 0,
					}
				} else if(border === 'bottom') {
					item.ddr.transform = {
						...item.ddr.transform,
						y: canvasRect.height - item.ddr.transform.height,
					}
				}
				// 同步到临时组件
				this.currentDDR = JSON.parse(JSON.stringify(item)) // 避免脏操作
				return
			}
			
			// 失活当前选中组件
			this.deactiveCurrent()
			// 避免脏操作
			const copyList = JSON.parse(JSON.stringify(this.list))
			if(border === 'left') {
				// 找到对齐目标
				const target = copyList.sort((a,b) => a.ddr.transform.x - b.ddr.transform.x)[0]
				// 修改其它组件的位置
				const otherList = this.list.filter(v => v.id !== target.id)
				otherList.forEach(v => {
					v.ddr.transform = {
						...v.ddr.transform,
						x: target.ddr.transform.x,
					}
				})
			} else if(border === 'right') {
				// 找到对齐目标
				const target = copyList.sort((b,a) => 
					(a.ddr.transform.x + a.ddr.transform.width) - (b.ddr.transform.x + b.ddr.transform.width))[0]
				// 修改其它组件的位置
				const otherList = this.list.filter(v => v.id !== target.id)
				otherList.forEach(v => {
					v.ddr.transform = {
						...v.ddr.transform,
						x: target.ddr.transform.x + target.ddr.transform.width - v.ddr.transform.width,
					}
				})
			} else if(border === 'top') {
				// 找到对齐目标
				const target = copyList.sort((a,b) => a.ddr.transform.y - b.ddr.transform.y)[0]
				// 修改其它组件的位置
				const otherList = this.list.filter(v => v.id !== target.id)
				otherList.forEach(v => {
					v.ddr.transform = {
						...v.ddr.transform,
						y: target.ddr.transform.y,
					}
				})
			} else if(border === 'bottom') {
				// 找到对齐目标
				const target = copyList.sort((b,a) => 
					(a.ddr.transform.y + a.ddr.transform.height) - (b.ddr.transform.y + b.ddr.transform.height))[0]
				// 修改其它组件的位置
				const otherList = this.list.filter(v => v.id !== target.id)
				otherList.forEach(v => {
					v.ddr.transform = {
						...v.ddr.transform,
						y: target.ddr.transform.y + target.ddr.transform.height - v.ddr.transform.height,
					}
				})
			}
			
			
		},
	}
}